<template>
	<view class="page">
		<view class="info_box" style="padding-bottom: 40rpx;">
			<view class="info_box_base">
				<view class="info_box_base_title" style="font-weight: bold;margin-bottom: 10rpx">站点信息</view>
				<view class="info_box_base_item">所属地区：{{baseInfo.region}}</view>
				<view class="info_box_base_item">站点编号：{{baseInfo.site_number}}</view>
				<view class="info_box_base_item" v-if="baseInfo.operators == 1">运营商：中国移动</view>
				<view class="info_box_base_item" v-if="baseInfo.operators == 2">运营商：中国电信</view>
				<view class="info_box_base_item" v-if="baseInfo.operators == 3">运营商：中国联通</view>
				<view class="info_box_base_item" style="color: red;" v-if="baseInfo.status == 3">拒绝原因：<text class="base_item_dd">{{baseInfo.rejection}}</text></view>
				<view class="info_box_base_item">
					<text>站点名称：</text>
					<u--input placeholder="请输入站点名称" :disabled="isedittitle?false:true" @blur="updateTitle" v-model="baseInfo.title"
						border="bottom"></u--input>
					<view style="color: rgb(25, 175, 201);font-size: 26rpx;" @click="isedittitle = !isedittitle">编辑</view>
				</view>
				<view class="info_box_base_item_1">
					<view class="info_box_base_item_img_title">站点照片</view>
					<view class="info_box_base_item_img_box">
						<u-upload :fileList="fileList1" width="65" height="65" @afterRead="afterRead"
							@delete="deletePic" name="1" multiple :maxCount="10"></u-upload>
					</view>
				</view>
				<view class="info_box_base_item">
					<text>站点地址：</text>
					<u--input placeholder="请输入站点地址"  :disabled="iseditaddress?false:true" @blur="updateAddress" v-model="baseInfo.site_address"
						border="bottom"></u--input>
					<view style="color: rgb(25, 175, 201);font-size: 26rpx;" @click="iseditaddress = !iseditaddress">编辑</view>
				</view>
				
				<view class="info_box_base_item">
					<text>联系人：</text>
					<u--input placeholder="请输入联系人"  :disabled="iseditlxr?false:true" @blur="updateLxr" v-model="baseInfo.contacts"
						border="bottom"></u--input>
					<view style="color: rgb(25, 175, 201);font-size: 26rpx;" @click="iseditlxr = !iseditlxr">编辑</view>
				</view>
				
				<view class="info_box_base_item">
					<text>联系电话：</text>
					<u--input placeholder="请输入联系电话" maxlength="11" :disabled="isedittel?false:true" @blur="updateTel" v-model="baseInfo.phonetel"
						border="bottom"></u--input>
					<view style="color: rgb(25, 175, 201);font-size: 26rpx;" @click="isedittel = !isedittel">编辑</view>
				</view>
				<!-- <view class="info_box_base_item">
					<text>联系人及电话：{{baseInfo.contacts}} {{baseInfo.phonetel}}</text> 
				</view> -->
				

				<!-- <view class="info_box_base_item_1">
					<view class="info_box_base_item_img_title">定位照片</view>
					<view class="info_box_base_item_img_box">
						<u-upload :fileList="fileList2" width="65" height="65" @afterRead="afterRead"
							@delete="deletePic" name="2" multiple :maxCount="10"></u-upload>
					</view>
				</view> -->


				<view class="info_box_base_item">
					<view class="info_box_base_item" style="width: 50%;">
						<text>经度：{{baseInfo.longitude}}</text>
						<!-- <u--input placeholder="请输入经度" border="bottom"></u--input> -->
					</view>
					<view class="info_box_base_item" style="width: 50%;">
						<text>纬度：{{baseInfo.latitude}}</text>
						<!-- <u--input placeholder="请输入纬度" border="bottom"></u--input> -->
					</view>
				</view>
				<view class="info_box_base_item">
					<text>网络类型：<text>{{network_type_text}}</text></text>
				</view>

				<view class="info_box_base_item">
					<text>设备型号：<text>{{baseInfo.equipment_model}}</text></text>
				</view>
				<view class="info_box_base_item">
					<text>设备数量：<text></text></text>
				</view>
				<view class="info_box_base_item_1">
					<!-- <view class="info_box_base_item_img_title">设备材料数量：</view> -->
					<view class="info_box_base_item_1_item" style="display: flex;flex-direction: row;flex-wrap: wrap;">
						<view class="info_box_base_item_1_item_i">
							<text>接收设备：{{baseInfo.equi_mater_receivingdevice}}</text>

						</view>
						<view class="info_box_base_item_1_item_i">
							<text>覆盖设备：{{baseInfo.equi_mater_coveragedevice}}</text>

						</view>
						<view class="info_box_base_item_1_item_i">
							<text>扩展设备4口：{{baseInfo.port_4expansion}}</text>

						</view>
						<view class="info_box_base_item_1_item_i">
							<text>扩展设备8口：{{baseInfo.port_8expansion}}</text>

						</view>
					</view>
				</view>

				<view class="info_box_base_item_1">
					<view class="info_box_base_item_img_title">设备照片</view>
					<view class="info_box_base_item_img_box">
						<u-upload :fileList="fileList3" width="65" height="65" @afterRead="afterRead"
							@delete="deletePic" name="3" multiple :maxCount="10"></u-upload>
					</view>
				</view>
				<view class="info_box_base_item">
					<text>竣工图纸：<text class="down_link" @click="down">点此链接下载</text></text>
				</view>

				<view class="info_box_base_item">
					<text>巡检方式：现场巡检</text>
				</view>
				<view class="info_box_base_item">
					<text>工单说明：{{baseInfo.work_orderdesc}}</text>
				</view>
			</view>
			<u-action-sheet :actions="list" :closeOnClickOverlay="true" :closeOnClickAction="true" :title="title"
				:show="show"></u-action-sheet>

			<u-datetime-picker :show="showdate" @cancel="showdate=false" @close="showdate=false" @confirm="confirmDate"
				v-model="value1" mode="datetime"></u-datetime-picker>
			<view class="btn" @click="next">下一步</view>
		</view>
	</view>
</template>

<script>
	import {
		api,
		apiBaseUrl,
		http
	} from '@/config/common.js'
	export default {
		data() {
			return {
				iseditlxr:false,
				isedittel:false,
				
				isedittitle:false,
				iseditaddress:false,
				id: '',
				packid: '',
				site_id: '',

				baseInfo: {},
				fileList1: [],
				fileList2: [],
				fileList3: [],
				network_type_text:'',
			}
		},
		components: {},
		filters: {},
		mounted() {},
		onLoad(e) {
			this.id = e.id
			this.packid = e.packid
			this.site_id = e.site_id
			this.getBaseInfo()
		},
		onShow() {},
		onPageScroll(e) {},
		beforeDestroy() {},
		methods: {
			down() {
				window.open(this.baseInfo.asbuilt_drawings, '_blank'); 
				// uni.previewImage({
				// 	urls:[this.baseInfo.asbuilt_drawings]
				// }) 
			},
			getBaseInfo() {
				uni.showLoading({})
				api.post('/api/shop/look_onsite_work_site_sh', {
					onsite_id: this.id,
					work_sitesh_id: this.site_id
				}).then(res => {
					let rst = res.data
					uni.hideLoading()
					if (rst.code == 1) {
						this.baseInfo = rst.data
						this.network_type_text = rst.data.network_type_id?rst.data.network_type_id.join(','):''
						let temp_1 = []
						rst.data.site_photos.forEach((item, index) => {
							temp_1.push({
								url: item
							})
						})
						this.fileList1 = temp_1

						let temp_3 = []
						rst.data.equipment_photos.forEach((item, index) => {
							temp_3.push({
								url: item
							})
						})
						this.fileList3 = temp_3


					}

				}).catch(err => {
					uni.hideLoading()
				})
			}, 
			updateTel(){
				let phonetel = this.baseInfo.phonetel
				uni.showLoading({})
				api.post('api/shop/onsiteworksitesh_edoit', {
					work_sitesh_id: this.site_id,
					type: 5,
					phonetel: phonetel
				}).then(res => {
					let rst = res.data
					uni.hideLoading()
					if (rst.code == 1) {
						this.isedittel = false
					}
				
				}).catch(err => {
					uni.hideLoading()
				})
			},
			updateLxr(){
				let contacts = this.baseInfo.contacts
				uni.showLoading({})
				api.post('api/shop/onsiteworksitesh_edoit', {
					work_sitesh_id: this.site_id,
					type: 4,
					contacts: contacts
				}).then(res => {
					let rst = res.data
					uni.hideLoading()
					if (rst.code == 1) {
						this.iseditlxr = false
					}
				
				}).catch(err => {
					uni.hideLoading()
				})
			},
			updateAddress() {
				let address = this.baseInfo.site_address
				uni.showLoading({})
				api.post('api/shop/onsiteworksitesh_edoit', {
					work_sitesh_id: this.site_id,
					type: 2,
					site_address: address
				}).then(res => {
					let rst = res.data
					uni.hideLoading()
					if (rst.code == 1) {
						this.iseditaddress = false
					}

				}).catch(err => {
					uni.hideLoading()
				})
			},
			updateTitle(e) {
				let title = this.baseInfo.title
				uni.showLoading({})
				api.post('api/shop/onsiteworksitesh_edoit', {
					work_sitesh_id: this.site_id,
					type: 1,
					title: title
				}).then(res => {
					let rst = res.data
					uni.hideLoading()
					if (rst.code == 1) {
					   this.isedittitle = false
					}

				}).catch(err => {
					uni.hideLoading()
				})
			},
			updateSbPhoto() {
				let equipment_photos = this.fileList3 ? this.fileList3.map(item => item.url).join('|') : [];
				uni.showLoading({})
				api.post('api/shop/onsiteworksitesh_edoit', {
					work_sitesh_id: this.site_id,
					type: 33,
					equipment_photos: equipment_photos
				}).then(res => {}).catch(err => {
					uni.hideLoading()
				})
			},
			updateSitePhoto() {
				let site_photos = this.fileList1 ? this.fileList1.map(item => item.url).join('|') : [];
				uni.showLoading({})
				api.post('api/shop/onsiteworksitesh_edoit', {
					work_sitesh_id: this.site_id,
					type: 3,
					site_photos: site_photos
				}).then(res => {}).catch(err => {
					uni.hideLoading()
				})
			},
			next() {
				this.updateSitePhoto()
				this.updateSbPhoto()
				uni.navigateTo({
					url: '/pages/xj/wlxj?id=' + this.id + '&packid=' + this.packid + '&site_id=' + this.site_id
				})
			},
			confirmDate(e) {
				this.jhtime = uni.$u.timeFormat(e.value, 'yyyy-mm-dd hh:MM:ss');
				this.showdate = false
			},
			// 删除图片
			deletePic(event) {
				this[`fileList${event.name}`].splice(event.index, 1)
			},
			// 新增图片
			async afterRead(event) {
				// 当设置 multiple 为 true 时, file 为数组格式，否则为对象格式
				let lists = [].concat(event.file)
				let fileListLen = this[`fileList${event.name}`].length
				lists.map((item) => {
					this[`fileList${event.name}`].push({
						...item,
						status: 'uploading',
						message: '上传中'
					})
				})
				for (let i = 0; i < lists.length; i++) {
					const result = await this.uploadFilePromise(lists[i].url)
					let item = this[`fileList${event.name}`][fileListLen]
					this[`fileList${event.name}`].splice(fileListLen, 1, Object.assign(item, {
						status: 'success',
						message: '',
						url: result
					}))
					fileListLen++
				}
			},
			uploadFilePromise(url) {
				return new Promise((resolve, reject) => {
					let a = uni.uploadFile({
						url: apiBaseUrl + '/api/shop/upload',
						filePath: url,
						name: 'file',
						header: {
							'method': "xj_user",
							'token': uni.getStorageSync('token')
						},
						formData: {
							user: 'test'
						},
						success: (res) => {
							setTimeout(() => {
								let rst = JSON.parse(res.data)
								if (rst.code == 1) {
									resolve(rst.data)
								} else {
									uni.$u.toast(rst.msg)
									this.deletePic(event)
								}
							}, 1000)
						}
					});
				})
			},
		}
	};
</script>

<style scoped>
	.down_link {
		color: rgb(11, 125, 218);
		font-size: 25rpx;
	}

	.info_box_base_item_1_item_i {
		width: 30%;
		display: flex;
		flex-direction: row;
		align-items: center;
		margin-left: 3%;
		margin-bottom: 20rpx;
	}

	.bt {
		color: red;
		margin-right: 10rpx;
	}

	.btn {
		width: 500rpx;
		height: 80rpx;
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: center;
		margin: 0 auto;
		margin-top: 40rpx;
		background-color: rgb(70, 179, 255);
		color: #fff;
		border-radius: 40rpx;
		font-size: 32rpx;
	}

	::v-deep .uni-input-input {
		font-size: 26rpx;
	}

	::v-deep .uni-input-placeholder {
		font-size: 26rpx;
	}

	.info_box_base_item_img_title {
		font-size: 25rpx;
		margin: 20rpx 0;
	}

	.gcxt_b_wy_reason {
		display: flex;
		flex-direction: row;
		align-items: center;
	}

	.gcxt_b_wy {
		display: flex;
		flex-direction: row;
		align-items: center;
		margin: 20rpx 0;
	}

	.info_box_base {
		border: 1px solid rgb(235, 229, 229);
		padding: 20rpx;
		font-size: 25rpx;
		margin-top: 20rpx;
	}

	.info_box_base_item {
		line-height: 45rpx;
		display: flex;
		flex-direction: row;
		align-items: center;
		margin-bottom: 10rpx;
	}

	.info_box {
		width: 710rpx;
		margin: 0 auto;

	}

	page {
		background-color: #fff;
	}
</style>